<template>
  <div>
    <div style="float: right">
      <div style="display: inline-block; color: red;font-weight: bolder;">请选择推送平台:</div>
      <div style="display: inline-block">
        <el-input v-model="input" placeholder="请输入知识名称" @keyup.enter.native="searchEnterFun($event)">
          <el-select @change="selectItem" collapse-tags slot="prepend"
                     v-model="bindingPlatform"
                     style="width: 160px;" placeholder="请选择推送平台">
            <el-option
              v-for="platform in bindingPlatforms"
              :key="platform.id"
              :label="platform.name"
              :value="platform.id">
            </el-option>
          </el-select>
          <i class="el-input__icon el-icon-search" slot="prefix"></i>
          <el-button :icon="appendIcon" slot="append" v-on:click="switchAppend"></el-button>
        </el-input>
      </div>
    </div>
    <div v-if="showAdvance" id="advance" style="padding: 10px; float: right">
      <div v-if="isToPlatform === 'true'" style="margin-top: 10px">
        <div style="width: 100px;display: inline-block;text-align: right">关联应用平台</div>
        <div style="display: inline-block;">
          <el-select v-model="platform" clearable placeholder="关联应用平台" size="small" style="width: 300px;">
            <el-option
              v-for="platform in platforms"
              :key="platform.id"
              :label="platform.name"
              :value="platform.id">
            </el-option>
          </el-select>
        </div>
      </div>
      <div style="margin-top: 10px">
        <div style="width: 100px;display: inline-block;text-align: right">状态</div>
        <div style="display: inline-block;">
          <el-select v-model="statu" placeholder="状态" size="small" style="width: 300px;">
            <el-option
              v-for="item in CONST.SYNC_STATUS"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </div>
      </div>
      <div v-if="drugInfoLibStatus">
        <div style="width: 100px;text-align:right; display: inline-block">
          <span>厂家</span>
        </div>
        <div style="display: inline-block">
          <el-input size="small" style="width: 300px;margin-top: 10px" v-model="drugInfoLibCompany"
                    placeholder="请输入厂家"></el-input>
        </div>
      </div>
      <div v-if="this.id === CONST.NEW_MEDIA_LIB_ID">
        <div style="width: 100px;text-align:right; display: inline-block">
          <span>是否排版</span>
        </div>
        <div style="display: inline-block">
          <el-select v-model="isCompose" clearable filterable style="width: 300px;margin-top: 10px">
            <el-option label="否" value="0">否</el-option>
            <el-option label="是" value="1">是</el-option>
          </el-select>
        </div>
      </div>
      <div style="margin-top: 30px; right: 10px;">
        <el-row>
          <el-col :offset="7" :span="9">
            <div style="margin-left: 90px;height: 32px; width: 88px;">
              <el-button size="small" v-on:click="advanceCancel">取 消</el-button>
            </div>
          </el-col>
          <el-col :offset="0.8" :span="2">
            <div div style="margin-left: 5px;height: 32px; width: 88px;">
              <el-button size="small" type="success" v-on:click="reset">重 置</el-button>
            </div>
          </el-col>
          <el-col :offset="2" :span="1">
            <div div style="height: 32px; width: 88px;">
              <el-button size="small" type="success" v-on:click="advanceConfirm">确 定</el-button>
            </div>
          </el-col>
        </el-row>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: ['id', 'drugInfoLibStatus', 'isToPlatform'],
  data() {
    return {
      uploadVisible: false,
      componentName: "",
      show: "true",
      input: '',
      noData: false,
      showAdvance: false,
      appendIcon: "el-icon-caret-bottom",
      platforms: [],
      bindingPlatforms: [],
      platform: '',
      updateTime: '',
      bindingPlatform: '',
      statu: '',
      searchData: [],
      drugInfoLibCompany: '',
      isCompose: ''
    };
  },
  methods: {
    switchAppend: function () {
      if (this.showAdvance) {
        this.showAdvance = false;
        this.appendIcon = "el-icon-caret-bottom";
      } else {
        this.showAdvance = true;
        this.appendIcon = "el-icon-caret-top";
      }
    },
    dateChange(val) {
      this.updateTime = val;
      if (val == null) {
        this.updateTime = ''
      }
    },
    advanceCancel: function () {
      this.showAdvance = false;
    },
    //高级搜索确定按钮
    advanceConfirm: function () {
      this.advanceCancel();
      this.$emit('confirm', 'isFromChild');
    },
    searchEnterFun(e) {
      const keyCode = window.event ? e.keyCode : e.which;
      if (keyCode === 13) {
        this.$emit('confirm', 'isFromChild');
      }
    },
    reset: function () {
      this.input = ''
      this.operation = ''
      this.platform = ''
      this.statu = ''
      this.updateTime = ''
      this.drugInfoLibCompany = ''
      this.isCompose = ''
    },
    selectItem(val) {
      this.bindingPlatform = val;
      this.$emit('confirm', 'isFromChild');
    },
    getAllPlatforms() {
      this.axios.get("/pmph/action/knowledgeLib/selectAllPlatforms").then((res) => {
        this.platforms = res.data.platforms;
      }).catch((err) => {
        console.error(err)
      })
    },
    getBindingAllPlatforms() {
      this.axios.get("/pmph/action/knowledgeLib/selectAllPlatforms", {
        params: {
          type: CONST.SYSTEM.KNOWLEDGE_LIB,
          knowledgeLibId: this.id
        }
      }).then((res) => {
        this.bindingPlatforms = res.data.platforms;
        if (this.bindingPlatforms.length > 0) {
          this.bindingPlatform = this.bindingPlatforms[0].id;
          this.$emit('confirm', 'isFromChild');
        }
      })
    },
  },
  mounted() {
    this.getAllPlatforms();
    this.getBindingAllPlatforms();
  }
}
</script>
